<template>
    <div>
        <!--    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">-->
        <!--      <el-form-item label="场景名称" prop="sceneName">-->
        <!--        <el-input-->
        <!--          v-model="queryParams.sceneName"-->
        <!--          placeholder="请输入场景名称"-->
        <!--          clearable-->
        <!--          size="small"-->
        <!--          @keyup.enter.native="handleQuery"-->
        <!--        />-->
        <!--      </el-form-item>-->
        <!--      <el-form-item label="执行周期表达式" prop="executeExpression">-->
        <!--        <el-input-->
        <!--          v-model="queryParams.executeExpression"-->
        <!--          placeholder="请输入执行周期表达式"-->
        <!--          clearable-->
        <!--          size="small"-->
        <!--          @keyup.enter.native="handleQuery"-->
        <!--        />-->
        <!--      </el-form-item>-->
        <!--      <el-form-item label="输入条件(无条件、与、或)" prop="inputCondition">-->
        <!--        <el-input-->
        <!--          v-model="queryParams.inputCondition"-->
        <!--          placeholder="请输入输入条件(无条件、与、或)"-->
        <!--          clearable-->
        <!--          size="small"-->
        <!--          @keyup.enter.native="handleQuery"-->
        <!--        />-->
        <!--      </el-form-item>-->
        <!--      <el-form-item label="输出条件(并行，串行)" prop="outputCondition">-->
        <!--        <el-input-->
        <!--          v-model="queryParams.outputCondition"-->
        <!--          placeholder="请输入输出条件(并行，串行)"-->
        <!--          clearable-->
        <!--          size="small"-->
        <!--          @keyup.enter.native="handleQuery"-->
        <!--        />-->
        <!--      </el-form-item>-->
        <!--      <el-form-item label="场景开关状态" prop="sceneSwitch">-->
        <!--        <el-input-->
        <!--          v-model="queryParams.sceneSwitch"-->
        <!--          placeholder="请输入场景开关状态"-->
        <!--          clearable-->
        <!--          size="small"-->
        <!--          @keyup.enter.native="handleQuery"-->
        <!--        />-->
        <!--      </el-form-item>-->
        <!--      <el-form-item>-->
        <!--        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
        <!--        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
        <!--      </el-form-item>-->
        <!--    </el-form>-->

        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button
                    type="primary"
                    plain
                    icon="el-icon-plus"
                    size="mini"
                    @click="handleAdd"
                    v-hasPermi="['business:scene:add']"
                >新增
                </el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="success"
                    plain
                    icon="el-icon-edit"
                    size="mini"
                    :disabled="single"
                    @click="handleUpdate"
                    v-hasPermi="['business:scene:edit']"
                >修改
                </el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="danger"
                    plain
                    icon="el-icon-delete"
                    size="mini"
                    :disabled="multiple"
                    @click="handleDelete"
                    v-hasPermi="['business:scene:remove']"
                >删除
                </el-button>
            </el-col>
            <!--      <el-col :span="1.5">-->
            <!--        <el-button-->
            <!--          type="warning"-->
            <!--          plain-->
            <!--          icon="el-icon-download"-->
            <!--          size="mini"-->
            <!--          @click="handleExport"-->
            <!--          v-hasPermi="['business:scene:export']"-->
            <!--        >导出</el-button>-->
            <!--      </el-col>-->
            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>

        <el-table v-loading="loading" :data="sceneList" @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center"/>
            <!--            <el-table-column label="id" align="center" prop="sceneId"/>-->
            <el-table-column label="名称" align="center" prop="sceneName"/>
            <el-table-column label="执行类型" align="center" prop="executeType">
                <template slot-scope="scope">
                    <span v-if="scope.row.executeType === '0'">执行一次</span>
                    <span v-if="scope.row.executeType === '1'">连续循环</span>
                    <span v-if="scope.row.executeType === '2'">周期执行</span>
                </template>
            </el-table-column>
            <!--      <el-table-column label="执行周期表达式" align="center" prop="executeExpression"/>-->
            <el-table-column label="输入条件" align="center" prop="inputCondition">
                <template slot-scope="scope">
                    <span v-if="scope.row.inputCondition === '0'">无条件</span>
                    <span v-if="scope.row.inputCondition === '1'">同时满足</span>
                    <span v-if="scope.row.inputCondition === '2'">满足一个以上</span>
                </template>
            </el-table-column>
            <el-table-column label="输出条件" align="center" prop="outputCondition">
                <template slot-scope="scope">
                    <span v-if="scope.row.outputCondition === '0'">同时控制</span>
                    <span v-if="scope.row.outputCondition === '1'">顺序控制</span>
                </template>
            </el-table-column>
            <el-table-column label="开关状态" align="center" prop="sceneSwitch">
                <template slot-scope="scope">

                    <el-switch
                        v-model="scope.row.sceneSwitch"
                        active-value="1"
                        inactive-value="0"
                        @change="handleSceneSwitchChange(scope.row)"
                    ></el-switch>

                </template>
            </el-table-column>
            <el-table-column label="场景状态" align="center" prop="sceneStatus">
                <template slot-scope="scope">

                    <span v-if="scope.row.sceneStatus ==='0'">已关闭</span>
                    <span v-if="scope.row.sceneStatus ==='1'">待运行</span>
                    <span v-if="scope.row.sceneStatus ==='2'">运行中</span>
                    <span v-if="scope.row.sceneStatus ==='3'">已完成</span>

                </template>
            </el-table-column>
            <!--      <el-table-column label="${comment}" align="center" prop="remark" />-->
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                <template slot-scope="scope">
                    <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-edit"
                        @click="handleUpdate(scope.row)"
                        v-hasPermi="['business:scene:edit']"
                    >修改
                    </el-button>
                    <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-delete"
                        @click="handleDelete(scope.row)"
                        v-hasPermi="['business:scene:remove']"
                    >删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>

        <pagination
            v-show="total>0"
            :total="total"
            :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize"
            @pagination="getList"
        />

        <!--    <el-form>-->
        <!--      <el-form-item label="网关名称" prop="gatewayId">-->
        <!--        <gateway-select @changeGateway="changeGateway" />-->
        <!--      </el-form-item>-->
        <!--    </el-form>-->

        <!-- 添加或修改场景表对话框 -->
        <el-dialog :title="title" :visible.sync="open" append-to-body :fullscreen="true">

            <!--            <el-tabs v-model="activeName">-->
            <!--                                <el-tab-pane label="场景信息" name="info">-->
            <!--                                </el-tab-pane>-->
            <!--                                <el-tab-pane label="输入条件" name="input-condition">-->
            <!--                                </el-tab-pane>-->
            <!--                                <el-tab-pane label="输出条件" name="output-condition">-->
            <!--                                </el-tab-pane>-->
            <!--            </el-tabs>-->


            <div style="margin-top: 20px;">
                <h4 class="form-header h4" style="font-size: 18px;">场景信息</h4>
                <el-form ref="form" :model="form" :rules="rules" label-width="80px" size="small">

                    <el-form-item label="场景名称" prop="sceneName">
                        <el-input v-model="form.sceneName" placeholder="请输入场景名称"/>
                    </el-form-item>

                </el-form>
            </div>


            <!--            输入条件-->
            <div style="margin-top: 40px;">
                <h4 class="form-header h4" style="font-size: 18px;">输入条件</h4>
                <el-form ref="form" :model="form" :rules="rules" label-width="80px" size="small">

                    <el-form-item label="执行类型" prop="inputCondition">
                        <el-select v-model="form.executeType">
                            <el-option
                                v-for="item in executeTypeList"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                            />
                        </el-select>
                    </el-form-item>

                    <el-form-item label="星期" v-if="form.executeType === '2'">
                        <el-radio-group v-model="weekDay" size="small" @change="weekDayChange">
                            <el-radio-button :label="0">一</el-radio-button>
                            <el-radio-button :label="1">二</el-radio-button>
                            <el-radio-button :label="2">三</el-radio-button>
                            <el-radio-button :label="3">四</el-radio-button>
                            <el-radio-button :label="4">五</el-radio-button>
                            <el-radio-button :label="5">六</el-radio-button>
                            <el-radio-button :label="6">日</el-radio-button>
                        </el-radio-group>

                        <el-button style="margin-left: 20px"
                                   icon="el-icon-plus"
                                   type="success"
                                   size="small"
                                   @click="addExecuteTime()"
                        />
                    </el-form-item>
                    <el-form-item v-if="form.executeType === '2'">
                        <el-select v-model="copyValues" placeholder="请选择复制日" clearable multiple>
                            <el-option v-for="item in weeList" :key="item.value" :label="item.label"
                                       :value="item.value" :disabled="item.disabled"
                            >
                            </el-option>
                        </el-select>

                        <el-button style="margin-left: 5px" type="primary" @click="copyDay">复制</el-button>
                    </el-form-item>

                    <div style="display: flex; flex-wrap: wrap" v-if="form.executeType === '2'">
                        <el-form-item v-if="executeTime.length>0" v-for="(item, index) in executeTime" :key="index">
                            <div style="display: flex">
                                <el-time-picker
                                    v-model="executeTime[index]"
                                    format="HH:mm"
                                    value-format="HH:mm"
                                    placeholder="选择时间"
                                >
                                </el-time-picker>
                                <el-link style="margin-left: 5px" @click="delExecuteTime(index)" type="danger"
                                         :underline="false"
                                >删除
                                </el-link>
                            </div>
                        </el-form-item>

                        <div v-if="executeTime.length===0">
                            <el-form-item>
                                未设置时间
                            </el-form-item>
                        </div>
                    </div>

                    <!--                        <el-form-item label="时间点" prop="executeTime" v-if="form.executeType === '2'">-->
                    <!--                            <el-input v-model="executeTime" placeholder="时间点"/>-->
                    <!--                        </el-form-item>-->

                    <!--                        <el-form-item label="周期" v-if="form.executeType === '2'">-->
                    <!--                            <el-select v-model="selectedTimeList"-->
                    <!--                                       placeholder="选择周期"-->
                    <!--                                       multiple-->
                    <!--                                       @remove-tag="removeTime"-->
                    <!--                                       @change="timeChange">-->
                    <!--                                <el-option-->
                    <!--                                        v-for="item in this.timeList"-->
                    <!--                                        :key="item.value"-->
                    <!--                                        :label="item.label"-->
                    <!--                                        :value="item.value"-->
                    <!--                                        @click.native="timeClick(item.value)"-->
                    <!--                                />-->
                    <!--                            </el-select>-->
                    <!--                        </el-form-item>-->

                    <!--                        <el-form-item label="时间" v-if="form.executeType === '2'">-->
                    <!--                            <el-time-picker-->
                    <!--                                    v-model="executeTime"-->
                    <!--                                    format="HH:mm"-->
                    <!--                                    value-format="HH:mm"-->
                    <!--                                    placeholder="选择时间">-->
                    <!--                            </el-time-picker>-->
                    <!--                        </el-form-item>-->

                    <el-form-item label="输入条件" prop="inputCondition">
                        <el-select v-model="form.inputCondition">
                            <el-option
                                v-for="item in inputConditionOption"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                            />
                        </el-select>
                    </el-form-item>

                </el-form>


                <el-form v-if="form.inputCondition !== '0'" :inline="true">

                    <el-form-item>
                        <el-select v-model="sensorSelectedList"
                                   placeholder="信息点"
                                   multiple
                                   @remove-tag="removeTag"
                                   @change="changeSensor"
                        >
                            <el-option
                                v-for="item in this.sensorList"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                                @click.native="sensorClick(item.value)"
                            />
                        </el-select>
                    </el-form-item>


                    <el-form-item>
                        <el-select v-model="loopSelectedList"
                                   placeholder="控制点"
                                   multiple
                                   @remove-tag="removeLoop"
                                   @change="changeLoop"
                        >
                            <el-option
                                v-for="item in this.loopList"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                                @click.native="loopClick(item.value)"
                            />
                        </el-select>
                    </el-form-item>

                    <el-form-item>
                        <el-button
                            size="small"
                            type="danger"
                            @click="clearInputCondition()"
                        >清空
                        </el-button>
                    </el-form-item>

                </el-form>

                <el-table :data="inputConditionList" v-if="form.inputCondition !== '0'">
                    <el-table-column label="名称" align="center" prop="inputEquipmentName"/>
                    <!--            <el-table-column label="名称" align="center" prop="equipmentName" show-overflow-tooltip />-->
                    <el-table-column label="类型" align="center" prop="inputEquipmentType">
                        <template slot-scope="scope">
                            <span v-if="scope.row.inputEquipmentType === '0'">信息点</span>
                            <span v-if="scope.row.inputEquipmentType === '1'">控制点</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="条件" align="center" prop="conditionType">

                        <template slot-scope="scope">

                            <el-select v-model="scope.row.conditionType">
                                <el-option
                                    v-for="item in conditionTypeList"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>

                        </template>
                    </el-table-column>

                    <el-table-column label="数值" align="center" prop="conditionValue">
                        <template slot-scope="scope">
                            <el-input v-model="scope.row.conditionValue"></el-input>
                        </template>
                    </el-table-column>

                    <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                        <template slot-scope="scope">
                            <el-button
                                size="small"
                                type="danger"
                                @click="deleteCondition(scope.row, scope.$index)"
                            >删除
                            </el-button>
                        </template>
                    </el-table-column>

                </el-table>
            </div>


            <!--            输出条件-->
            <div style="margin-top: 40px;">
                <h4 class="form-header h2" style="font-size: 18px;">输出条件</h4>
                <el-form ref="form" :model="form" :rules="rules" label-width="80px">
                    <el-form-item label="输出条件" prop="outputCondition">

                        <el-radio-group v-model="form.outputCondition" size="small">
                            <el-radio-button label="0">同时控制</el-radio-button>
                            <el-radio-button label="1">顺序控制</el-radio-button>
                        </el-radio-group>

                    </el-form-item>
                </el-form>

                <el-form>

                    <el-form-item>
                        <el-select v-model="outputLoopSelectedList"
                                   placeholder="控制点"
                                   multiple
                                   @remove-tag="outputRemoveLoop"
                                   style="width: 100%"
                        >
                            <el-option
                                v-for="item in this.loopList"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                                @click.native="outputLoopClick(item.value)"
                            />
                        </el-select>
                    </el-form-item>

                </el-form>


                <el-table :data="this.outputConditionList">

                    <el-table-column label="名称" align="center" prop="outputEquipmentName"/>

                    <el-table-column label="执行数值" align="center" prop="beginValue">
                        <template slot-scope="scope">
                            <el-input v-model="scope.row.beginValue"></el-input>
                        </template>
                    </el-table-column>

                    <el-table-column label="完成数值" align="center" prop="endValue">
                        <template slot-scope="scope">
                            <el-input v-model="scope.row.endValue"></el-input>
                        </template>
                    </el-table-column>

                    <el-table-column label="结束条件" align="center" prop="endCondition">

                        <template slot-scope="scope">

                            <el-select v-model="scope.row.endCondition">
                                <el-option
                                    v-for="item in endConditionList"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>

                        </template>
                    </el-table-column>

                    <el-table-column label="延迟时间(秒)" align="center" prop="delaySeconds">
                        <template slot-scope="scope">
                            <el-input v-model="scope.row.delaySeconds"></el-input>
                        </template>
                    </el-table-column>

                    <el-table-column label="执行时间(分)" align="center" prop="executeTime">
                        <template slot-scope="scope">
                            <el-input v-model="scope.row.executeTime"></el-input>
                        </template>
                    </el-table-column>

                    <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                        <template slot-scope="scope">
                            <el-button
                                size="small"
                                type="danger"
                                @click="deleteOutputCondition(scope.row, scope.$index)"
                            >删除
                            </el-button>
                        </template>
                    </el-table-column>

                </el-table>
            </div>


            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitForm">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import { addScene, changeSceneSwitch, delScene, getScene, pageListScene, updateScene } from '@/api/business/scene'
import gatewaySelect from '../../common/GatewaySelect.vue'
import { listSensor } from '@/api/equipment/sensor'
import { listLoop } from '@/api/equipment/loop'
import { mapGetters } from 'vuex'

export default {
    name: 'Scene',
    components: {
        gatewaySelect
    },
    data() {
        return {
            // 遮罩层
            loading: true,
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // 场景表表格数据
            sceneList: [],
            // 弹出层标题
            title: '',
            // 是否显示弹出层
            open: false,
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                sceneName: null,
                executeType: null,
                executeExpression: null,
                inputCondition: null,
                outputCondition: null,
                sceneSwitch: null,
                sceneStatus: null
            },
            // 表单参数
            form: {},
            // 表单校验
            rules: {},
            activeName: 'info',
            inputConditionList: [],
            outputConditionList: [],
            conditionTypeList: [
                { value: '0', label: '等于' },
                { value: '1', label: '不等于' },
                { value: '2', label: '大于' },
                { value: '3', label: '大于等于' },
                { value: '4', label: '小于' },
                { value: '5', label: '小于等于' }
            ],
            endConditionList: [
                { value: '0', label: '输入条件不满足' },
                { value: '1', label: '自定义时间' }
            ],
            executeTypeList: [
                { value: '0', label: '执行一次' },
                { value: '1', label: '连续循环' },
                { value: '2', label: '自定义周期' }
            ],
            inputConditionOption: [
                { value: '0', label: '无条件' },
                { value: '1', label: '同时满足' },
                { value: '2', label: '满足一个以上' }
            ],
            timeList: [
                { value: '1', label: '星期一' },
                { value: '2', label: '星期二' },
                { value: '3', label: '星期三' },
                { value: '4', label: '星期四' },
                { value: '5', label: '星期五' },
                { value: '6', label: '星期六' },
                { value: '7', label: '星期日' }
            ],
            copyValues: [],
            weeList: [
                { value: 1, label: '星期一',disabled:true },
                { value: 2, label: '星期二' ,disabled:false},
                { value:3, label: '星期三' ,disabled:false},
                { value: 4, label: '星期四',disabled:false },
                { value: 5, label: '星期五' ,disabled:false},
                { value: 6, label: '星期六',disabled:false },
                { value:7, label: '星期日',disabled:false }],
            sensorList: [],
            loopList: [],
            sensorSelectedList: [],
            loopSelectedList: [],
            outputLoopSelectedList: [],
            selectedTimeList: [],
            // 当前时间
            executeTime: [],

            lastWeekDay: 0,
            weekDay: 0,
            weekDayExecuteTime: [
                [], [], [], [], [], [], []
            ]
        }
    },
    created() {
        this.getList()
    },
    methods: {

        addExecuteTime() {
            let time = '00:00'
            let length = this.executeTime.length
            if (length >= 10) {
                this.$message.info('一天最多添加10个时间点')
                return
            }
            this.executeTime.push(time)
        },

        delExecuteTime(index) {
            this.executeTime.splice(index, 1)
        },

        weekDayChange(val) {
            // console.log('val...', val)
            this.weekDayExecuteTime[this.lastWeekDay] = this.executeTime
            this.executeTime = this.weekDayExecuteTime[val]
            this.lastWeekDay = val
            this.weeList.forEach(item=>{
                if(item.value==(val+1)){
                    item.disabled = true
                }else {
                    item.disabled= false
                }
            })
        },
        // 复制选中的开始日
        copyDay() {
            console.log(this.copyValues)
            console.log(this.weekDay)
            this.weekDayExecuteTime[this.lastWeekDay] = this.executeTime
            if(this.copyValues.length>0){
                this.copyValues.forEach((item,index)=>{
                    this.weekDayExecuteTime[item-1] = JSON.parse(JSON.stringify(this.executeTime))
                })
            }
            // 深拷贝
            // this.weekDayExecuteTime[this.copyValues-1] = JSON.parse(JSON.stringify(this.executeTime))
            this.$message.success('复制成功')
            console.log('executeTime', this.executeTime)
            console.log('weekDayExecuteTime', this.weekDayExecuteTime)
        },
        // timeClick(value) {
        //
        //     let obj = this.timeList.find((item) => {
        //         return item.value === value
        //     })
        //
        //     let name = obj.label
        //
        // },

        removeTime(value) {

        },

        clearInputCondition() {
            this.sensorSelectedList = []
            this.loopSelectedList = []
            this.inputConditionList = []
        },

        clearOutputCondition() {
            this.outputConditionList = []
            this.outputLoopSelectedList = []
        },

        handleSceneSwitchChange(row) {

            // row.sceneSwitch 即将要切换的值

            console.log(row.sceneSwitch)

            let text = row.sceneSwitch === '0' ? '关闭' : '开启'

            if (row.sceneStatus === '1') {
                this.$modal.confirm('场景' + '"' + row.sceneName + '"' + '正在运行中，是否强制' + text + '？').then(function() {
                    return changeSceneSwitch(row.sceneId, row.sceneSwitch)
                }).then(() => {

                    this.getList()

                    this.$modal.msgSuccess(text + '成功')

                }).catch(function() {
                    row.sceneSwitch = row.sceneSwitch === '0' ? '1' : '0'
                })

            } else {

                this.$modal.confirm('确认要' + text + '"' + row.sceneName + '"场景吗？').then(function() {
                    return changeSceneSwitch(row.sceneId, row.sceneSwitch)
                }).then(() => {

                    this.getList()

                    this.$modal.msgSuccess(text + '成功')
                }).catch(function() {
                    row.sceneSwitch = row.sceneSwitch === '0' ? '1' : '0'
                })

            }
        },

        deleteOutputCondition(row, index) {

            let ind = this.outputLoopSelectedList.indexOf(row.outputEquipmentId)

            this.outputLoopSelectedList.splice(ind, 1)

            this.outputConditionList.splice(index, 1)

        },

        deleteCondition(row, index) {

            if (row.inputEquipmentType === '0') {
                let index = this.sensorSelectedList.indexOf(row.inputEquipmentId)
                this.sensorSelectedList.splice(index, 1)
            }

            if (row.inputEquipmentType === '1') {
                let index = this.loopSelectedList.indexOf(row.inputEquipmentId)
                this.loopSelectedList.splice(index, 1)
            }

            this.inputConditionList.splice(index, 1)

        },

        removeLoop(value) {

            let obj = this.form.inputConditionList.find((item) => {
                return item.inputEquipmentId === value && item.inputEquipmentType === '1'
            })

            let index = this.form.inputConditionList.indexOf(obj)
            this.form.inputConditionList.splice(index, 1)
        },

        removeTag(value) {

            let obj = this.inputConditionList.find((item) => {
                return item.inputEquipmentId === value && item.inputEquipmentType === '0'
            })

            let index = this.inputConditionList.indexOf(obj)
            this.inputConditionList.splice(index, 1)

        },

        sensorClick(value) {

            let obj = this.sensorList.find((item) => {
                return item.value === value
            })

            let name = obj.label

            let condition = {}
            condition = {
                'inputEquipmentId': value,
                'inputEquipmentName': name,
                'inputEquipmentType': '0',
                'conditionType': null,
                'conditionValue': null
            }

            let obj2 = this.inputConditionList.find((item) => {
                return item.inputEquipmentId === value && item.inputEquipmentType === '0'
            })

            if (obj2 === undefined) {
                this.inputConditionList.push(condition)
            } else {
                let index = this.inputConditionList.indexOf(obj2)
                this.inputConditionList.splice(index, 1)
            }

        },

        changeSensor(value) {
        },

        loopClick(value) {

            let obj = this.loopList.find((item) => {
                return item.value === value
            })

            let name = obj.label

            let condition = {}
            condition = {
                'inputEquipmentId': value,
                'inputEquipmentName': name,
                'inputEquipmentType': '1',
                'conditionType': null,
                'conditionValue': null
            }

            let obj2 = this.inputConditionList.find((item) => {
                return item.inputEquipmentId === value && item.inputEquipmentType === '1'
            })

            if (obj2 === undefined) {
                this.inputConditionList.push(condition)
            } else {
                let index = this.inputConditionList.indexOf(obj2)
                this.inputConditionList.splice(index, 1)
            }

        },

        outputRemoveLoop(value) {
            let obj = this.outputConditionList.find((item) => {
                return item.outputEquipmentId === value
            })

            let index = this.outputConditionList.indexOf(obj)
            this.outputConditionList.splice(index, 1)
        },

        outputLoopClick(value) {
            let obj = this.loopList.find((item) => {
                return item.value === value
            })

            let name = obj.label

            let condition = {}
            condition = {
                'outputEquipmentId': value,
                'outputEquipmentName': name,
                'outputEquipmentType': '1',
                'beginValue': null,
                'endValue': null,
                'endCondition': null,
                'delaySeconds': null,
                'executeTime': null
            }

            let obj2 = this.outputConditionList.find((item) => {
                return item.outputEquipmentId === value
            })

            if (obj2 === undefined) {
                this.outputConditionList.push(condition)
            } else {
                let index = this.outputConditionList.indexOf(obj2)
                this.outputConditionList.splice(index, 1)
            }

        },

        changeLoop(value) {
        },

        getList() {
            this.loading = true
            pageListScene(this.queryParams).then(response => {
                this.sceneList = response.rows
                this.total = response.total
                this.loading = false
            })
            this.selectSensorAndLoop()
        },

        selectSensorAndLoop() {
            this.sensorList = []
            listSensor({}).then(response => {
                // console.log(response)
                for (let item of response.data) {
                    let temp = {}
                    temp['value'] = item.sensorId
                    temp['label'] = item.sensorName
                    temp['equipmentType'] = '0'
                    this.sensorList.push(temp)
                }
            })

            this.loopList = []
            listLoop({}).then(response => {
                for (let item of response.data) {
                    let temp = {}
                    temp['value'] = item.loopId
                    temp['label'] = item.loopName
                    temp['equipmentType'] = '1'
                    this.loopList.push(temp)
                }
            })
        },

        cancel() {
            this.open = false
            this.reset()
        },

        reset() {

            this.sensorSelectedList = []
            this.loopSelectedList = []
            this.inputConditionList = []
            this.outputConditionList = []
            this.outputLoopSelectedList = []

            this.weekDay = 0
            this.lastWeekDay = 0

            this.weekDayExecuteTime = [
                [], [], [], [], [], [], []
            ]

            this.executeTime = []
            this.activeName = 'info'

            this.form = {
                sceneId: null,
                sceneName: null,
                executeType: null,
                executeExpression: null,
                inputCondition: null,
                outputCondition: null,
                sceneSwitch: null,
                sceneStatus: '0',
                createTime: null,
                createBy: null,
                updateTime: null,
                updateBy: null,
                remark: null
            }

            this.resetForm('form')
        },

        handleQuery() {
            this.queryParams.pageNum = 1
            this.getList()
        },

        resetQuery() {
            this.resetForm('queryForm')
            this.handleQuery()
        },

        handleSelectionChange(selection) {
            this.ids = selection.map(item => item.sceneId)
            this.single = selection.length !== 1
            this.multiple = !selection.length
        },

        handleAdd() {
            this.reset()
            this.open = true
            this.title = '添加场景'
        },

        handleUpdate(row) {
            this.reset()
            const sceneId = row.sceneId || this.ids

            this.sensorSelectedList = []
            this.loopSelectedList = []
            this.inputConditionList = []
            this.outputConditionList = []
            this.outputLoopSelectedList = []

            // this.selectedTimeList = []

            getScene(sceneId).then(response => {

                console.log(response.data)

                for (let item of response.data.inputConditionList) {
                    if (item.inputEquipmentType === '0') {
                        this.sensorSelectedList.push(item.inputEquipmentId)
                    }

                    if (item.inputEquipmentType === '1') {
                        this.loopSelectedList.push(item.inputEquipmentId)
                    }
                }

                for (let item of response.data.outputConditionList) {
                    this.outputLoopSelectedList.push(item.outputEquipmentId)
                }

                if (response.data.cycleList !== null) {
                    for (let item of response.data.cycleList) {
                        let i = parseInt(item.dayName) - 1
                        if (i === 0) {
                            this.executeTime = item.timeList
                        }
                        this.weekDayExecuteTime[i] = item.timeList
                    }
                }

                this.outputConditionList = response.data.outputConditionList
                this.inputConditionList = response.data.inputConditionList

                this.form = response.data
                this.open = true
                this.title = '修改场景'
            })
        },

        submitForm() {
            this.$refs['form'].validate(valid => {
                if (valid) {
                    this.form.inputConditionList = this.inputConditionList
                    for (let i = 0; i < this.outputConditionList.length; i++) {
                        this.outputConditionList[i].orderNumber = i + 1
                    }
                    this.form.outputConditionList = this.outputConditionList

                    if (this.weekDay === 0) {
                        this.weekDayExecuteTime[0] = this.executeTime
                    }
                    let cycleList = []
                    let len = this.weekDayExecuteTime.length
                    for (let i = 0; i < len; ++i) {
                        let obj = {
                            'dayName': (i + 1) + '',
                            'timeList': this.weekDayExecuteTime[i]
                        }
                        cycleList.push(obj)
                    }
                    this.form.cycleList = cycleList

                    if (this.form.sceneId != null) {
                        updateScene(this.form).then(response => {
                            this.$modal.msgSuccess('修改成功')
                            this.open = false
                            this.getList()
                        })
                    } else {
                        addScene(this.form).then(response => {
                            this.$modal.msgSuccess('新增成功')
                            this.open = false
                            this.getList()
                        })
                    }
                }
            })
        },

        handleDelete(row) {
            const sceneIds = row.sceneId || this.ids
            this.$modal.confirm('是否确认删除场景表编号为"' + sceneIds + '"的数据项？').then(function() {
                return delScene(sceneIds)
            }).then(() => {
                this.getList()
                this.$modal.msgSuccess('删除成功')
            }).catch(() => {
            })
        },

        handleExport() {
            this.download('system/scene/export', {
                ...this.queryParams
            }, `scene_${new Date().getTime()}.xlsx`)
        }
    }
}
</script>
<style>
::v-deep .el-tabs__active-bar {
    background-color: #1890ff;
}
</style>

